<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
	    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" />
		<title>login</title>
		<link rel="stylesheet" href="css/bootstrap.min.css" />
		<link rel="stylesheet" href="css/style.css" />
	</head>
	<body>
		<div class="page-sign page-bg">
			<header>
				<img src="img/Logo.png" class="logo" />
			</header>
			<div class="sign-login">
				<div class="row">
					<a href="" class="col-xs-6 a-now a-sign" title="group-sign-in">sign in</a>
					<a href="" class="col-xs-6 a-sign" title="group-sign-up">sign up</a>
				</div>
				<div class="a-cont">
				 <form method="get" action="groups.html">
					<ul class="list-group group-sign-in">
						<li class="list-item">
							<label class="user-name">
								<input type="text" placeholder="username" name="uname" />
							</label>
						</li>
						<li class="list-item">
							<label class="pass-word">
								<input type="password" placeholder="password" name="pwd" />
							</label>
						</li>
						<button class="btn btn-all" type="submit">continue</button>
					</ul>
				 </form>
				 <form method="post"  action="groups.html">
					<ul class="list-group group-sign-up">
						<li class="list-item">
							<label class="user-name">
								<input type="text" placeholder="username" />
							</label>
						</li>
						<li class="list-item">
							<label class="pass-word">
								<input type="password" placeholder="password" />
							</label>
						</li>		
						<li class="list-item">
							<label class="email">
								<input type="email" placeholder="email" />
							</label>
						</li>
						<li class="list-item">
							<label class="bir">
								<input type="text" placeholder="brithday" />
							</label>
						</li>	
						<div class="btn-foot">
					        <button class="btn btn-all" type="submit">continue</button>
					        <a href="">forgot password</a>
				        </div>
					</ul>
				</form>
				</div>
			</div>
		</div>
		
		<script type="text/javascript" src="js/jquery-1.11.0.js" ></script>
		<script>
			$(".page-bg").css("min-height",$(window).height());
			
			$(".a-sign").each(function  () {
				$(this).click(function  (e) {
					e.preventDefault();
					$(".a-now").removeClass("a-now");
					$(this).addClass("a-now");
					var get_t = $(this).attr("title");
					$(".list-group").hide();
					$("."+get_t).show();
			        $(".page-bg").css("min-height",$(window).height());					
				})
			})
			
			
			
		</script>
	</body>
</html>
